<template>
  <div>
    <keep-alive>
      <demo1 v-if="show"></demo1>
    </keep-alive>

    <demo2 v-if="!show"></demo2>
    <button @click="() => { show = !show }">切换</button>
  </div>
</template>

<script setup>
import { ref } from 'vue'
import demo1 from './components/demo1.vue'
import demo2 from './components/demo2.vue'
const show = ref(true)
</script>

<style lang="css" scoped></style>